<template>
	<view>
		<view class="orderbg">
			<view class="statistics">未签字</br>{{orderState.noSign}}</view>
			<view class="statistics">已签字</br>{{orderState.isSign}}</view>
			<view class="statistics">拒绝交易</br>{{orderState.noOrder}}</view>
			<view class="statistics">交易成功</br>{{orderState.isOrder}}</view>
		</view>
		<view class="orderdown">
			<view class="orderbutton">
				<view class="ordering">订单进行中</view>
				<view class="thisbutton" @click="goto(1)">
					<u-icon name="../../../static/icon/ordermanage/stamping.svg" class="buttonimage" label="待签字"
					 size="45" label-pos="right" label-color="rgba(128, 128, 128, 1)" margin-left="26" label-size="28rpx"></u-icon>
				</view>
				<view class="thisbutton" @click="goto(2)">
					<u-icon name="../../../static/icon/ordermanage/stamped.svg" class="buttonimage" label="已签字"
					 size="45" label-pos="right" label-color="rgba(128, 128, 128, 1)" margin-left="26" label-size="28rpx"></u-icon>
				</view>
			</view>
			<view class="orderbutton">
				<view class="ordering">订单结束</view>
				<view class="thisbutton" @click="goto(3)">
					<u-icon name="../../../static/icon/ordermanage/refuse.svg" class="buttonimage" label="拒绝交易"
					 size="45" label-pos="right" label-color="rgba(128, 128, 128, 1)" margin-left="26" label-size="28rpx"></u-icon>
				</view>
				<view class="thisbutton" @click="goto(4)">
					<u-icon name="../../../static/icon/ordermanage/success.png" class="buttonimage" label="交易成功"
					 size="45" label-pos="right" label-color="rgba(128, 128, 128, 1)" margin-left="26" label-size="28rpx"></u-icon>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	/**
	 * 订单状态
	 * 1 未签字，2 已签字，3 拒绝签字，4 交易成功
	 */
	export default {
		data() {
			return {
				// 各类型订单数量统计
				orderState:{
					noSign: 0, //未签字
					isSign: 0, //已签字
					noOrder: 0, //拒绝签字
					isOrder: 0 //交易成功
				}
			}
		},
		methods: {
			//页面跳转
			goto(u) {
				uni.navigateTo({
					url: '../order_processing/order_processing?'+'pageid='+u,
					animationType: 'slide-in-right',
					animationDuration: 1000
				})
			},
			getAllKindsOfNums(){
				this.$myRequest({
					url: '/contractOrder/getAllKindsOfNums',
					method: 'post'
				}).then(res=>{
					let data = res.data
					if(data.code === 200){
						data.data.filter(item=>{
							if(item['orderStatus']===1) this.orderState.noSign = item['num'];
							if(item['orderStatus']===2) this.orderState.isSign = item['num'];
							if(item['orderStatus']===3) this.orderState.noOrder = item['num'];
							if(item['orderStatus']===4) this.orderState.isOrder = item['num'];
						})
					}
				})
			}
		},
		mounted() {
			this.getAllKindsOfNums()
		},
		onPullDownRefresh() {
			this.getAllKindsOfNums();
		}
	}
</script>

<style>
	@import url("orderprocess.css");
</style>
